<template>
    <div class="newObjectList">
        <div class="crumbs">
            <el-breadcrumb separator-class="el-icon-arrow-right">
                <el-breadcrumb-item> <i class="el-icon-folder" style="margin-right:10px"></i>项目部管理 </el-breadcrumb-item>
                <el-breadcrumb-item>新项目</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <div class="container">
            <div class="handle-box">
                <div class="title">新项目</div>
                <el-button type="primary" class="titleBtn" icon="el-icon-plus" style="width:75px;" @click="addNewObject" v-if="types != 4"
                    >新建</el-button
                >
                <el-button type="primary" @click="tableToExcel" class="titleBtn1 reportBtn" style="margin-right:10px;width:60px;"
                    >导出</el-button
                >
                <div class="prjectName mr20">
                    <span class="name">项目名称</span>
                    <el-input class="handle-select mr10" placeholder="请输入" v-model="query.projectname"></el-input>
                </div>
                <div class="prjectName mr20">
                    <span class="name">项目类型</span>
                    <el-cascader
                        class="handle-select mr10"
                        v-model="category"
                        :options="options"
                        :props="{ expandTrigger: 'hover' }"
                        @change="handleChange"
                    ></el-cascader>
                </div>

                <div class="department mr0">
                    <span class="name">所属事业部</span>
                    <el-select v-model="query.deptid" placeholder="请选择" @change="getQuerySelectedDep" class="handle-select mr10">
                        <el-option v-for="item in depOptions" :key="item.deptid" :label="item.deptname" :value="item.deptid"></el-option>
                    </el-select>
                </div>
                <div class="stateTime mr20">
                    <span class="name" style="padding-left:17px;">开始时间</span>
                    <el-date-picker
                        class="handle-select"
                        v-model="query.startdate"
                        type="date"
                        placeholder="请选择"
                        value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </div>
                 <div class="stateTime mr20">
                    <span class="name" style="padding-left:17px;">结束时间</span>
                    <el-date-picker
                        class="handle-select"
                        v-model="query.enddate"
                        type="date"
                        placeholder="请选择"
                        value-format="yyyy-MM-dd"
                    ></el-date-picker>
                </div>
                <div class="searchBox">
                    <!-- <el-input v-model="query.name" placeholder="用户名" class="handle-input mr10"></el-input> -->
                    <el-button class="titleBtn" type="primary" style="width:60px;margin-left:14px" @click="handleSearch">查询</el-button>
                    <el-button class="titleBtn1" type="primary" style="width:60px" @click="reset">重置</el-button>
                </div>
            </div>

            <el-table
                :data="tableData"
                border
                stripe
                class="table"
                ref="multipleTable"
                header-cell-class-name="table-header"
                empty-text="暂无数据"
            >
                <!-- <el-table-column type="selection" width="55" align="center"></el-table-column> -->
                <el-table-column show-overflow-tooltip label="序号" width="55" align="center">
                    <template slot-scope="scope">{{ scope.$index + 1 }}</template>
                </el-table-column>
                <el-table-column prop="projectid" label="项目ID" :show-overflow-tooltip="true" align="center"></el-table-column>
                <el-table-column prop="projectname" label="项目名称" :show-overflow-tooltip="true" align="center"></el-table-column>
                <el-table-column show-overflow-tooltip label="合同总产值" align="center">
                    <template slot-scope="scope">{{ scope.row.contractvalue }}万</template>
                </el-table-column>
                <el-table-column prop="deptname" label="所属事业部" :show-overflow-tooltip="true" align="center"></el-table-column>
                <el-table-column show-overflow-tooltip prop="startdate" label="开工时间" align="center"></el-table-column>
                <el-table-column show-overflow-tooltip label="工期" align="center">
                    <template slot-scope="scope">{{ scope.row.period }}个月</template>
                </el-table-column>
                <el-table-column show-overflow-tooltip prop="userid" label="关联用户ID" align="center"></el-table-column>
                <el-table-column prop="category" label="项目类型" :show-overflow-tooltip="true" align="center"></el-table-column>
                <el-table-column show-overflow-tooltip prop="region" label="区域(省)" align="center"></el-table-column>
                <el-table-column show-overflow-tooltip prop="state" label="实施状态" :formatter="isState" align="center"></el-table-column>
                <el-table-column label="操作" align="center" width="260" v-if="types == 1 || types == 0">
                    <template slot-scope="scope">
                        <el-button type="text" @click="decomposeEdit(scope.$index, scope.row)">细化分解</el-button>
                        <el-button type="text" @click="handleDelete(scope.$index, scope.row)">新建确认</el-button>
                        <el-button type="text" @click="deleteproject(scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div class="pagination">
                <el-pagination
                    background
                    layout="prev, pager, next"
                    :current-page="query.page"
                    :page-size="pageSize"
                    :total="pageTotal"
                    @current-change="handlePageChange"
                ></el-pagination>
            </div>
        </div>

        <el-dialog title="新建项目" :visible.sync="addVisible" width="590px">
            <el-form class="newForm" ref="form" :model="form" label-position="left" label-width="100px">
                <el-form-item label="项目ID" style="padding-top:34px">
                    <el-input
                        placeholder="请输入"
                        disabled
                        class="newFormInput"
                        v-model="form.projectid"
                        style="background-color:#fff"
                    ></el-input>
                </el-form-item>
                <el-form-item label="项目名称">
                    <el-input placeholder="请输入" class="newFormInput" v-model="form.projectname" maxlength="200"></el-input>
                </el-form-item>
                <el-form-item label="登录密码">
                    <el-input placeholder="请输入" class="newFormInput" v-model="form.password" maxlength="20"></el-input>
                </el-form-item>
                <el-form-item label="区域（省）">
                    <el-select class="newFormInput" v-model="form.region" placeholder="请选择" @click="getRegion">
                        <el-option v-for="item in regions" :key="item.id" :label="item.areaName" :value="item.areaName"></el-option>
                    </el-select>
                </el-form-item>
                <!-- <el-form-item label="项目类型">
                    <el-cascader
                    class="newFormInput"
                        v-model="form.category"
                        :options="options"
                        :props="{ expandTrigger: 'hover' }"
                    ></el-cascader>
                </el-form-item> -->
                <el-form-item label="项目类型">
                    <el-cascader
                        class="newFormInput"
                        v-model="form.category"
                        :options="options"
                        :props="{ expandTrigger: 'hover' }"
                    ></el-cascader>
                </el-form-item>
                <el-form-item label="合同产值">
                    <el-input
                        placeholder="请输入"
                        class="newFormInput"
                        v-model="form.contractvalue"
                        maxlength="15"
                       oninput="value=value.replace(/[^\d.]/g, '').replace(/^\./g, '').replace(/^(\-)*(\d+)\.(\d\d\d\d\d\d).*$/, '$1$2.$3').replace(/\./, '#').replace(/\./g, '').replace('#', '.')"
                      
                    >
                        <template slot="suffix">万元</template>
                    </el-input>
                    <!-- <input
                        type="number"
                        step="1"
                        onkeyup="this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : ''"
                        placeholder="请输入或查看"
                        v-model="form.contractvalue"
                    />-->
                </el-form-item>
                <el-form-item label="预算金额">
                    <el-input
                        placeholder="请输入"
                        class="newFormInput"
                        v-model="form.budgetAmount"
                        maxlength="15"
                        oninput="value=value.replace(/[^\d.]/g, '').replace(/^\./g, '').replace(/^(\-)*(\d+)\.(\d\d\d\d\d\d).*$/, '$1$2.$3').replace(/\./, '#').replace(/\./g, '').replace('#', '.')"
                    >
                        <template slot="suffix">万元</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="所属事业部">
                    <el-select class="newFormInput" v-model="form.deptid" placeholder="请选择" @click="getAddSelectedDep">
                        <el-option v-for="item in depOptions" :key="item.deptid" :label="item.deptname" :value="item.deptid"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="开工时间">
                    <el-date-picker
                        border="none"
                        class="handle-date-picker"
                        v-model="form.startdate"
                        type="date"
                        value-format="yyyy-MM-dd"
                        format="yyyy.MM.dd"
                        placeholder="请选择"
                    ></el-date-picker>
                </el-form-item>
                <el-form-item label="项目工期">
                    <el-input
                        placeholder="请输入"
                        class="newFormInput"
                        v-model.number="form.period"
                        maxlength="5"
                        @keyup.native="changePeriod"
                    >
                        <template slot="suffix">个月</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="上报时间">
                    <el-select class="newFormInput" v-model="form.reportday" placeholder="请选择">
                        <el-option key="1" label="每月 1 日" value="1"></el-option>
                        <el-option key="2" label="每月 2 日" value="2"></el-option>
                        <el-option key="3" label="每月 3 日" value="3"></el-option>
                        <el-option key="4" label="每月 4 日" value="4"></el-option>
                        <el-option key="5" label="每月 5 日" value="5"></el-option>
                        <el-option key="6" label="每月 6 日" value="6"></el-option>
                        <el-option key="7" label="每月 7 日" value="7"></el-option>
                        <el-option key="8" label="每月 8 日" value="8"></el-option>
                        <el-option key="9" label="每月 9 日" value="9"></el-option>
                        <el-option key="10" label="每月 10 日" value="10"></el-option>
                        <el-option key="11" label="每月 11 日" value="11"></el-option>
                        <el-option key="12" label="每月 12 日" value="12"></el-option>
                        <el-option key="13" label="每月 13 日" value="13"></el-option>
                        <el-option key="14" label="每月 14 日" value="14"></el-option>
                        <el-option key="15" label="每月 15 日" value="15"></el-option>
                        <el-option key="16" label="每月 16 日" value="16"></el-option>
                        <el-option key="17" label="每月 17 日" value="17"></el-option>
                        <el-option key="18" label="每月 18 日" value="18"></el-option>
                        <el-option key="19" label="每月 19 日" value="19"></el-option>
                        <el-option key="20" label="每月 20 日" value="20"></el-option>
                        <el-option key="21" label="每月 21 日" value="21"></el-option>
                        <el-option key="22" label="每月 22 日" value="22"></el-option>
                        <el-option key="23" label="每月 23 日" value="23"></el-option>
                        <el-option key="24" label="每月 24 日" value="24"></el-option>
                        <el-option key="25" label="每月 25 日" value="25"></el-option>
                        <el-option key="26" label="每月 26 日" value="26"></el-option>
                        <el-option key="27" label="每月 27 日" value="27"></el-option>
                        <el-option key="28" label="每月 28 日" value="28"></el-option>
                        <el-option key="29" label="每月 29 日" value="29"></el-option>
                        <el-option key="30" label="每月 30 日" value="30"></el-option>
                        <el-option key="31" label="每月 31 日" value="31"></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div class="tableBtnBox" style="margin:40px 0 30px">
                <button class="btn1" @click="cancelAdd">取消</button>
                <button class="btn2" @click="addConfirm">确认</button>
            </div>
        </el-dialog>

        <!-- 细化分表弹框 -->
        <div class="specity1">
            <el-dialog :close-on-click-modal="false" title="细化分解" :visible.sync="decomposeVisible" @close="decomposeCancle" width="690px" class="specityBox">
                <div class="tableBox">
                    <table id="table" style="width:509px;">
                        <thead>
                            <tr>
                                <th class="tableTitle m1" style="width:77px">序号</th>
                                <th class="tableTitle" style="width:127px">分项内容</th>
                                <th class="tableTitle" style="width:80px;">数量</th>
                                <th class="tableTitle">单价(元)</th>
                                <th class="tableTitle">单位</th>
                                <th class="tableTitle" style="width:109px">分项系数</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr v-for="(user, index) in stu" :class="index % 2 == 0 ? 'tr1' : 'tr2'" :key="index">
                                <td style="text-align:center;width:30px;">
                                    <input class="td-input" style="width:30px" type="text" :value="index + 1" />
                                </td>
                                <td style="text-align:center;width:120px;">
                                    <input class="td-input" style="width:120px" type="text" v-model="user.subitem" />
                                </td>
                                <td style="text-align:center;width:100px;">
                                    <input
                                        class="td-input"
                                        v-model="user.quantity"
                                        oninput="value=value.replace(/[^\d.]/g, '').replace(/^\./g, '').replace(/\.{2,}/g, '').replace('.', '$#$').replace(/\./g, '').replace('$#$','.').replace(/^(\-)*(\d+)\.(\d\d).*$/,'$1$2.$3')"
                                        maxlength="15"
                                    />
                                </td>
                                <td style="text-align:center;width:100px;">
                                    <input
                                        class="td-input"
                                        v-model="user.price"
                                        oninput="value=value.replace(/[^\d.]/g, '').replace(/^\./g, '').replace(/\./, '#').replace(/\./g, '').replace('#', '.')"
                                        maxlength="200"
                                    />
                                </td>
                                <td style="text-align:center;width:100px;">
                                  <select v-model="user.unit">
                                    <option v-for="ele of optionUint" :key="ele" :value="ele">{{ele}}</option>
                                  </select>
                                </td>
                                <td style="text-align:center">{{ ((user.quantity * (Number(user.price))) / (contractvalue*10000)).toFixed(2) }}</td>
                                <td style="border:none">
                                    <i
                                        class="el-icon-remove"
                                        @click="remove(index)"
                                        style="color:#D0021B;font-size:24px;margin-left:14px"
                                    ></i>
                                </td>
                            </tr>
                            <tr style="height:60px;">
                                <td style="text-align:center;width:30px;border-right:none ">
                                    <div @click="insert" style="white-space:nowrap;height:44px;line-height:44px;cursor:pointer;">
                                        <div style="float:left;padding-left:15px;">
                                            <i class="el-icon-circle-plus" style="color:#004FAB;font-size:24px;padding-top:8px;"></i>
                                        </div>
                                        <span style="margin-left:11px;font-size:13px;color:#333;width:200px;">新添加行</span>
                                    </div>
                                </td>
                                <td style="text-align:center;width:120px;border-left:none;border-right:none"></td>
                                <td style="text-align:center;width:100px; border-left:none;border-right:none"></td>
                                <td style="text-align:center;width:100px;border-left:none;border-right:none"></td>
                                <td style="text-align:center;width:100px;border-left:none;border-right:none"></td>
                                <td style="text-align:center;border-left:none"></td>
                                <td style="border:none"></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="tableBtnBox">
                    <button class="btn1" @click="decomposeCancle">取消</button>
                    <button class="btn2" @click="decomposeConfirm">确认</button>
                </div>
            </el-dialog>
        </div>
        <!-- 新建确认弹框 -->
    </div>
</template>

<script>
import {
    addProject,
    getProjectList,
    confirmNew,
    specifyList,
    updateSpecify,
    findDepList,
    areaList,
    resetPassword,
    findAll,
    createProjectId,
    delectObject,
    allCategory,
    savePreSpecify
} from '../../api/index';
import { throttle } from '@/utils/tools.js';
export default {
    name: 'basetable',
    data() {
        /**
         * optionUint: 细化分解单位选项数据
         */
        return {
            value1: '',
            user: { orderNo: '', subitem: '', quantity: '', price: '', coefficient: '', unit: null },
            stu: [
                // { orderNo: '', subitem: '', quantity: '', price: '', coefficient: '' }
            ],
            query: {
                page: 1,
                state: 0,
                projectname: '',
                deptid: '',
                startdate: '',
                enddate:'',
                classifyId: '',
                categoryId: ''
            },
            category: '',
            //用户搜索条件
            querySearch: {
                state: 0,
                projectname: '',
                deptid: '',
                startdate: '',
                enddate:'',
                category: ''
            },
            types:localStorage.getItem('type'),
            regions: [], //地址列表
            depOptions: [], //事业部列表
            pageTotal: 0,
            pageSize: 10,
            contractvalue: '',
            ids: '',
            tableData: [],
            tableData1: [],
            //细化分解表格
            multipleSelection: [],
            delList: [],
            // editVisible: false,
            addVisible: false,
            decomposeVisible: false, //细化分解弹框
            form: {
                projectid: '', //项目id
                projectname: '', //项目名称
                password: '123456',
                region: '',
                contractvalue: '', //合同总产值
                budgetAmount: '',
                deptid: '', //所属事业部
                startdate: '',
                period: '',
                reportday: '',
                category: '' //项目类型
            },
            options: [
                {
                    value: '测绘地理信息板块',
                    label: '测绘地理信息板块',
                    children: [
                        {
                            value: '航测遥感',
                            label: '航测遥感'
                        },
                        {
                            value: '不动产测绘',
                            label: '不动产测绘'
                        },
                        {
                            value: '工程测量',
                            label: '工程测量'
                        },
                        {
                            value: '应用地球物理工程',
                            label: '应用地球物理工程'
                        },
                        {
                            value: '地理信息功能',
                            label: '地理信息功能'
                        },
                        {
                            value: '其他',
                            label: '其他'
                        }
                    ]
                },
                {
                    value: '地下管网板块',
                    label: '地下管网板块',
                    children: [
                        {
                            value: '管网探测',
                            label: '管网探测'
                        },
                        {
                            value: '管网检测与修复',
                            label: '管网检测与修复'
                        },
                        {
                            value: '地下管网信息系统建设',
                            label: '地下管网信息系统建设'
                        },
                        {
                            value: '其他',
                            label: '其他'
                        }
                    ]
                },
                {
                    value: '智慧城市板块',
                    label: '智慧城市板块',
                    children: [
                        {
                            value: '智慧城市顶层设计',
                            label: '智慧城市顶层设计'
                        },
                        {
                            value: '城市治理',
                            label: '城市治理'
                        },
                        {
                            value: '公共安全',
                            label: '公共安全'
                        },
                        {
                            value: '智慧产业',
                            label: '智慧产业'
                        },
                        {
                            value: '其他',
                            label: '其他'
                        }
                    ]
                }
            ], //项目类型
            idx: -1,
            id: -1,
            totals: '',
            optionUint: ['宗','户','平方米','米','公里','平方公里'],
            xhfjSubmit: false
        };
    },
    created() {
        this.getRegions();
        this.getData();
        this.getDepList();
    },
    mounted() {
        //  this.getprojectid()
        // this.getAllData();
        this.getAllCategory();
    },
    watch: {
      stu(newValue, oldValue) {
        console.log(newValue)
      }
    },
    methods: {
        // handleInput2(e){
        //     e.target.value=e.target.value.replace(/[^\d]/g,'')|| null;
        // },
        // 获取 列表数据的模拟数据
        getData() {
            // console.log(this.query.page);
            getProjectList(this.query).then(res => {
                if (res.code === 200) {
                    if (res.result.projectList) {
                        this.tableData = res.result.projectList;
                        this.query.page = res.result.pageInfo.current;
                        this.pageTotal = res.result.pageInfo.total;
                        let time = this.getTime();
                        let projectNum = res.result.projectNum + 1 > 9 ? res.result.projectNum + 1 : '0' + (res.result.projectNum + 1); //项目编号
                        // this.form.projectid = 'ZJZY' + time + projectNum;
                    } else {
                        let time = this.getTime();
                        this.tableData = [];
                        this.query.page = 1;
                        this.pageTotal = 0;
                        // this.form.projectid = 'ZJZY' + time + '01';
                    }
                } else {
                    this.tableData = [];
                    this.query.page = 0;
                    this.pageTotal = 0;
                    // let projectNum=(res.result.projectNum+1)>9?(res.result.projectNum+1):'0'+(res.result.projectNum+1);//项目编号
                    // this.form.projectid ="ZJZY"+time+projectNum;
                    // this.form.projectid = 'ZJZY' + time + '01';
                }
            });
            //  this.form.projectid = 'ZJZY'+this.form.startdate+this.pages.size
        },
        getAllData() {
            findAll(this.query).then(res => {
                if (res.code === 200) {
                    this.tableData1 = res.result.projectList;
                    this.getdaochu();
                }
            });
        },
        //获取事业部项目列表
        getDepList() {
            findDepList().then(res => {
                //    console.log(res)
                if (res.code === 200) {
                    if (localStorage.getItem('deptid') !== 'null') {
                        this.depOptions = res.result.filter(res => {
                            return res.deptid == localStorage.getItem('deptid');
                        });
                        console.log(this.depOptions);
                    } else {
                        this.depOptions = res.result;
                    }
                }
            });
        },
        //获取地址列表
        getRegions() {
            let param = {
                area_type: 1
            };
            areaList(param).then(res => {
                console.log(res.result);
                if (res.code === 200) {
                    this.regions = res.result;
                    console.log(this.regions);
                }
            });
        },
        //获取当前时间并处理
        getTime() {
            let now = new Date();
            let year = now.getFullYear(); //得到年份
            let month = now.getMonth() + 1 > 9 ? now.getMonth() + 1 : '0' + (now.getMonth() + 1); //得到月份
            return year + month;
        },
        //格式化实施状态
        isState(scope) {
            if (scope.state === 0) {
                return '新项目';
            } else if (scope.state === 1) {
                return '进行中';
            } else if (scope.state === 2) {
                return '已完成';
            }else if(scope.state === 3) {
                return '待验收';
            }else if(scope.state === 4) {
                return '停工';
            }else{
                return '已验收'
            }
            // return scope.state;
        },
        // 触发搜索按钮
        handleSearch() {
            this.query.page = 1;
            getProjectList(this.query).then(res => {
                if (res.code === 200) {
                    if (res.result.projectList) {
                        this.tableData = res.result.projectList;
                        this.query.page = res.result.pageInfo.current;
                        this.pageTotal = res.result.pageInfo.total;
                        let time = this.getTime();
                        let projectNum = res.result.projectNum + 1 > 9 ? res.result.projectNum + 1 : '0' + (res.result.projectNum + 1); //项目编号
                        // this.form.projectid = 'ZJZY' + time + projectNum;
                    } else {
                        let time = this.getTime();
                        this.tableData = [];
                        this.query.page = 1;
                        this.pageTotal = 0;
                        // this.form.projectid = 'ZJZY' + time + '01';
                    }
                } else {
                    this.tableData = [];
                    this.query.page = 0;
                    this.pageTotal = 0;
                    // let projectNum=(res.result.projectNum+1)>9?(res.result.projectNum+1):'0'+(res.result.projectNum+1);//项目编号
                    // this.form.projectid ="ZJZY"+time+projectNum;
                    // this.form.projectid = 'ZJZY' + time + '01';
                }
            });
        },
        //获取选中的key
        getQuerySelectedDep(item) {
            this.query.deptid = item;
        },
        // 点击新建确认操作
        handleDelete(index, row) {
            // 二次确认创建
            this.$confirm(`新建确认后无法修改“细化分解”\n是否确认？`, {
                customClass: 'newObjectConfirm',
                center: true,
                showClose: false,
                cancelButtonClass: 'newObjectCancel',
                confirmButtonClass: 'newObjectConfirm'
            })
                .then(() => {
                    console.log(this.stu,this.stu.length != 0);
                    if (this.stu.length != 0) {
                        confirmNew({ projectid: row.projectid }).then(res => {
                            console.log(res);
                            if (res.code === 200) {
                                row.state = 1;
                                this.$message.success('新建成功');
                                this.getData();
                            } else {
                                this.$message.error(res.message);
                            }
                            // this.$message.success('新建成功');
                            // this.tableData.splice(index, 1);
                        });
                    } else {
                        this.$message.error('请先配置细化分解');
                    }
                })
                .catch(() => {});
        },

        // 分页导航
        handlePageChange(val) {
            this.query.page = val;
            this.getData();
        },
        //点击重置
        reset() {
            (this.query = {
                page: 1,
                state: 0,
                projectname: '',
                deptid: '',
                startdate: '',
                enddate:'',
                classifyId: '',
                categoryId: ''
            }),
                (this.value1 = '');
            this.category = '';
            this.getData();
        },
        //点击新建项目
        addNewObject() {
            createProjectId().then(res => {
                console.log(res.result);
                if (res.code === 200) {
                    this.form.projectid = res.result;
                    console.log(this.form.projectid);
                    this.addVisible = true;
                } else {
                    this.$message.error('网络错误');
                }
            });
            this.getAllCategory();

            // console.log(this.form.projectid)
        },
        //点击项目弹框确认按钮
        addSave() {
            this.addVisible = false;
        },
        //细化分解操作
        decomposeEdit(index, row) {
            this.ids = row.projectid;
            this.contractvalue = row.contractvalue;
            this.totals = row.contractvalue * 10000;
            specifyList({ projectid: this.ids }).then(res => {
                if (res.code == 200) {
                    this.stu = res.result.specifyList;
                } else {
                    this.$message.error(message);
                }
                this.decomposeVisible = true;
            });
        },
        insert() {
            let data = JSON.parse(JSON.stringify(this.user));
            data.orderNo = this.stu.length + 1;
            this.stu.push(data);
        },
        remove(index) {
            this.stu.splice(index, 1);
        },

        //细化分表弹出后点击确认
        decomposeConfirm(index, row) {
            this.xhfjSubmit = true
            const params = this.stu.filter((item, index) => {
                let state = true;
                item.orderNo = index + 1;
                item.coefficient = (item.quantity * item.price) / (this.contractvalue * 10000);
                return state;
            });
            var x = this.stu;
            for (var isNo in x) {
                console.log('index' + x[index]);
            }
            let a = x.reduce((sum, cur) => {
                return Number(cur.price * cur.quantity) + Number(sum);
            }, []);
            // if (Number(a).toFixed(4) != Number(this.totals)) {
            //     this.$message.error('各分项的金额不等于总金额,请重新输入!');
            // } else {
                updateSpecify({ specify: JSON.stringify(params), projectid: this.ids }).then(res => {
                    //  console.log(this.stu);
                    if (res.code == 200) {
                        console.log(this.stu);
                        this.decomposeVisible = false;
                        this.$message.success(res.message);
                    } else {
                        this.$message.error(res.message);
                    }
                });
            // }
        },
        //点击细化分解取消
        decomposeCancle(){
            console.log(this.ids);
            console.log(this.stu);
            if (this.xhfjSubmit) {
              this.xhfjSubmit = false
              return
            }
             let params = this.stu.filter((item, index) => {
                let state = true;
                item.orderNo = index + 1;
                item.coefficient = (item.quantity * item.price) / (this.contractvalue * 10000);
                return state;
            });
             console.log('params:' + JSON.stringify(params));
             savePreSpecify({specify:JSON.stringify(params),projectid:this.ids}).then(res=>{
                 this.decomposeVisible = false
             })
        },
        //获取新增项目时选用的事业部
        getAddSelectedDep(item) {
            this.form.deptid = item;
        },
        getRegion(item) {
            this.from.region = item;
        },
        //新建点击确认
        addConfirm: throttle(function() {
            let form = {
                projectid: this.form.projectid, //项目id
                projectname: this.form.projectname, //项目名称
                password: this.$md5(this.form.password),
                contractvalue: this.form.contractvalue, //合同总产值
                deptid: this.form.deptid, //所属事业部
                region: this.form.region,
                startdate: this.form.startdate,
                period: this.form.period,
                reportday: this.form.reportday,
                category: this.form.category,
                classifyId: this.form.category[0],
                categoryId: this.form.category[1],
                budgetAmount: this.form.budgetAmount
            };
            //项目名称
            if (form.projectname == '请输入' || form.projectname == '') {
                this.$message.error('项目名称不能为空');
                return;
            }
            //区域(省)
            if (form.region == '请输入' || form.region == '') {
                this.$message.error('区域（省）不能为空');
                return;
            }
            //项目类型
            if (form.category == '请输入' ||form.category=='') {
                this.$message.error('项目类型不能为空');
                return;
            }
            //合同产值
            if (form.contractvalue == '请输入' || form.contractvalue == 0) {
                this.$message.error('无效合同产值');
                return;
            }
            //预算金额
            if (form.budgetAmount == '请选择' || form.budgetAmount == '') {
                this.$message.error('预算金额不能为空');
                return;
            }
            //所属事业部
            if (form.deptid == '请输入' || form.deptid == '') {
                this.$message.error('事业部不能为空');
                return;
            }
            //开工时间
            if (form.startdate == '请输入' || form.startdate == '') {
                this.$message.error('开工时间不能为空');
                return;
            }
            //项目工期
            if (form.period == 0 || form.period == '') {
                this.$message.error('项目工期不能为0');
                return;
            }
            //上报时间
            if (form.reportday == '请选择' || form.reportday == '') {
                this.$message.error('上报时间不能为空');
                return;
            }
            //预算金额不能大于合同产值
            if (form.budgetAmount > form.contractvalue) {
                this.$message.error('预算金额不能大于合同产值');
                return;
            }
            addProject(form).then(res => {
                if (res.code === 200) {
                    this.$message.success('新建成功');
                    this.getData();
                    this.addVisible = false;
                    this.form = {
                        projectid: '', //项目id
                        projectname: '', //项目名称
                        password: '123456',
                        region: '',
                        contractvalue: '', //合同总产值
                        deptid: '', //所属事业部
                        startdate: '',
                        period: '',
                        reportday: ''
                    };
                } else {
                    this.$message({
                        type: 'error',
                        message: res.message
                    });
                    // this.addVisible = false;
                }
            });
        }, 3000),

        //点击导出
        tableToExcel() {
            this.getAllData();
        },
        //导出列表
        getdaochu() {
            this.tableData1.filter((item, index) => {
                item.id = index + 1;
                item.contractvalue = item.contractvalue + '万';
                item.state = '新项目';
                item.period = item.period + '个月';
                item.deptid = '';
                item.reportstate = '';
                item.reportday = '';
                item.totalCompletedValue = '';
                item.proSpecifyList = ' ';
                item.timeSchedule = '';
                // item.coefficient =0.2
                // Object.keys(item).forEach(key=>{
                //     if(!item[key]&&item[key]!==0){
                //         state=false
                //         return state
                //     }
                // })
            });
            console.log('tabData1' + this.tableData1);
            // 列标题，逗号隔开，每一个逗号就是隔开一个单元格
            let str = `序号,项目ID,项目名称,合同总产值,所属事业部,开工时间,工期,关联用户ID,区域(省),实施状态,项目类型\n`;
            //增加\t为了不让表格显示科学计数法或者其他格式
            for (let i = 0; i < this.tableData1.length; i++) {
                for (let item in this.tableData1[i]) {
                    str += `${this.tableData1[i][item] + '\t'},`;
                }
                str += '\n';
            }
            //encodeURIComponent解决中文乱码
            let uri = 'data:text/csv;charset=utf-8,\ufeff' + encodeURIComponent(str);
            //通过创建a标签实现
            let link = document.createElement('a');
            link.href = uri;
            //对下载的文件命名
            link.download = '未开始的项目数据表.csv';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
        },
        //对分项系数进行计算index
        // calValue(index){
        //     let totalValue=0;
        //     alert("11")
        //    for(let i=0;i<stu.length;i++){
        //         totalValue+=stu.price*stu.quantity;
        //    }
        //    if(totalValue>this.contractvalue){
        //        this.$message({
        //            type:"error",
        //            message:"分项内容总额大于总产值，新增分项失败"
        //        })
        //        this.stu.splice(index, 1);
        //     return;
        // //    }else if(totalValue===this.contractvalue){
        // //        let coefficient=0;
        //        for(let i=0;i<stu.length;i++){
        //            coefficient+=stu.coefficient;
        //        }

        //    }
        //删除项目
        deleteproject(scope) {
            this.$confirm('是否删除项目', {
                customClass: 'newObjectConfirm',
                center: true,
                showClose: false,
                cancelButtonClass: 'newObjectCancel',
                confirmButtonClass: 'newObjectConfirm'
            })
                .then(() => {
                    delectObject({ projectid: scope.projectid }).then(res => {
                        if (res.code == 200) {
                            this.$message.success('项目删除成功');
                            this.getData();
                        }
                    });
                })
                .catch(() => {});
        },
        //取消新增
        cancelAdd() {
            this.addVisible = false;
            this.form = {
                projectid: '', //项目id
                projectname: '', //项目名称
                password: '123456',
                region: '',
                contractvalue: '', //合同总产值
                deptid: '', //所属事业部
                startdate: '',
                period: '',
                reportday: ''
            };
        },

        //处理合同产值的格式
        changeContractvalue() {
            this.$nextTick(() => {
                if (this.form.contractvalue !== null) {
                    // alert(11);
                    // var reg = /^[0-9]{8}$/; /*定义验证表达式*/
                    // return reg.test(this.form.contractvalue);
                    this.form.contractvalue = this.form.contractvalue.replace(/\.{2,}/g, '.'); //只保留第一个. 清除多余的
                    this.form.contractvalue = this.form.contractvalue.replace(/[^\d+(\.\d{0,6})?$]/g, '');
                }
            });
        },
        //处理工期的格式
        changePeriod() {
            this.$nextTick(() => {
                // alert(11)
                if (this.form.period !== null) {
                    this.form.period = this.form.period.replace(/[^\d]/g, '');
                }
            });
        },
        //处理数量格式
        changeNum() {
            this.$nextTick(() => {
                if (this.user.quantity !== null) {
                    alert(this.user.quantity);
                    if (this.user.quantity < 0) {
                        this.user.quantity = 0;
                    }
                }
            });
        },
        //处理单价个数
        changePrice() {
            this.$nextTick(() => {
                if (this.user.price !== null) {
                    this.user.price = this.user.price.replace(/\D/g, '');
                }
            });
        },
        handleChange(value) {
            (this.query.classifyId = value[0]), (this.query.categoryId = value[1]);
            console.log(value);
        },
        //取所有项目的分类
        getAllCategory() {
            allCategory({}).then(res => {
                if (res.code == 200) {
                    this.options = res.result.classifyList;
                    this.options.filter((item, index) => {
                        item.value = item.id;
                        item.label = item.name;
                        item.children = item.categoryList;
                        item.children.filter((item, index) => {
                            item.value = item.id;
                            item.label = item.name;
                        });
                    });

                    console.log(this.options);
                } else {
                    this.$message.error(message);
                }
            });
        }
    }
};
</script>

<style scoped lang="scss">
.handle-box {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.title {
    height: 28px;
    line-height: 28px;
    font-size: 20px;
    font-family: PingFangSC-Medium, PingFang SC;
    font-weight: 500;
    color: rgba(51, 51, 51, 1);
    margin-right: 8px;
    min-width: 60px;
}
.titleBtn {
    background: rgba(33, 74, 143, 1);
    color: #fff;
    border: none;
    font-size: 16px;
    border-radius: 5px;
    height: 35px;
    // margin-right: 20px !important;
}
.titleBtn1 {
    background: rgba(0, 79, 171, 0.2);
    color: rgba(0, 79, 171, 1);
    border: none;
    font-size: 16px;
    border-radius: 5px;
    height: 35px;
    // margin-right: 20px !important;
}
// .reportBtn{
//     margin-right:93px !important;
// }
.handle-box .name {
    margin-right: 10px;
}
.mr0{
    font-size: 14px;
    // margin-right: 8px;
    min-width: 230px;
}
.mr20 {
    font-size: 14px;
    // margin-right: 8px;
    min-width: 223px;
}
.handle-select {
    width: 140px;
}
.searchBox {
    min-width: 220px;
    margin-left: auto;
    white-space: nowrap;
}
.handle-input {
    width: 300px;
    display: inline-block;
}
.table {
    width: 100%;
    font-size: 14px;
}
.title {
    float: left;
}
.red {
    color: #ff0000;
}
.mr10 {
    margin-right: 10px;
}
.table-td-thumb {
    display: block;
    margin: auto;
    width: 40px;
    height: 40px;
}
/* 弹出框样式 */
.td-input {
    width: 100px;
    border: none;
    height: 40px;
    text-align: center;
}
.tableTitle {
    background: rgba(184, 216, 255, 0.2);
    border: 1px solid rgba(184, 216, 255, 1);
    margin: 0;
    min-width: 100px;
    height: 40px;
}
.newObjectList >>> .el-dialog__body {
    padding: 0 0px 30px 30px;
}
.tr1 {
    height: 40px;
}
.tr1 input {
    height: 30px;
}
.tr2 {
    height: 40px;
    background: rgba(184, 216, 255, 0.05);
}
.tr2 input {
    background: transparent;
    height: 30px;
}
/* .addListBtn{
} */
.newObjectConfirm {
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    line-height: 28px;
    background: rgba(0, 79, 171, 1) !important;
}
.newObjectCancel {
    width: 90px !important;
    height: 35px;
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 5px;
}
#table {
    border-collapse: collapse;
}
#table td {
    border: 1px solid rgba(184, 216, 255, 1);
}
.m1 {
    min-width: 40px;
    width: 40px;
}
.tableBtnBox {
    margin-top: 64px;
    // margin-bottom:64px!important;
    text-align: center;
    .btn1 {
        width: 90px;
        height: 35px;
        background: rgba(0, 79, 171, 0.2);
        border-radius: 5px;
        border: none;
        font-size: 16px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(0, 79, 171, 1);
        margin-right: 56px;
    }
    .btn2 {
        width: 90px;
        height: 35px;
        background: rgba(0, 79, 171, 1);
        border-radius: 5px;
        border: none;
        font-size: 16px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(255, 255, 255, 1);
    }
}
.newForm {
    .el-form-item {
        border-bottom: 1px solid #d8d8d8;
    }
    .newFormInput/deep/.el-input__inner {
        border: none;
        width: 450px;
    }
    /deep/.el-icon-arrow-up:before {
        display: inline-block;
        width: 8px;
        height: 5px;
    }
}
.newObjectList/deep/.el-dialog__header {
    background: rgba(33, 74, 143, 0.1);
    font-size: 18px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: rgba(33, 74, 143, 1);
}
.newObjectList/deep/.el-dialog__body {
    max-height: 720px;
    // overflow-y: scroll;
    position: relative;
}
.newObjectList/deep/.el-icon-close:before {
    border-radius: 50%;
    color: #fff;
    background-color: rgba(33, 74, 143, 1);
}
.newObjectList/deep/.el-input__inner {
    color: rgba(153, 153, 153, 1);
    height: 35px;
}
.newObjectList/deep/.el-form-item__label {
    color: #333;
    font-size: 16px;
}
.handle-date-picker {
    width: 100%;
    border: none;
}
.newForm/deep/.el-input__inner {
    border: none;
}
.newForm /deep/.el-icon-date:before {
    content: none;
}
.newForm /deep/.el-input--prefix .el-input__inner {
    padding-left: 15px;
}
.specityBox {
    .tableBox {
        // border:1px solid red;
        max-height: 452px;
        overflow-y: scroll;
    }
    .tableBox::-webkit-scrollbar {
        width: 0;
    }
}
.specity1/deep/.el-dialog__body {
    padding: 30px 0 20px 20px;
    padding-bottom: 64px;
}
.progress/deep/.el-progress__text {
    width: 100% !important;
}

input[type='number'] {
    -moz-appearance: textfield;
}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
</style>
